<template>
    <div class="measure--info">
      <div class="measure--info--wrap" v-if="type == '甲状腺'">
        <div class="measure--info--left">
          <div class="measure--info--sub">自动测量</div>
          <div class="measure--info--sub-item">左右径:(cm)</div>
          <div class="measure--info--sub-item">前后径:(cm)</div>
          <div class="measure--info--sub-item">上下径:(cm)</div>
        </div>
        <div class="measure--info--right">
          <div class="measure--info--box">
            <div class="measure--info--title">峡部</div>
            <div class="measure--info--con">/</div>
            <div class="measure--info--con">
              {{ thyroid_measure["0"] ? thyroid_measure["0"] : "/" }}
            </div>
            <div class="measure--info--con">/</div>
          </div>
          <div class="measure--info--box">
            <div class="measure--info--title">右侧叶</div>
            <div class="measure--info--con">
              {{ thyroid_measure["1"] ? thyroid_measure["1"] : "/" }}
            </div>
            <div class="measure--info--con">
              {{ thyroid_measure["2"] ? thyroid_measure["2"] : "/" }}
            </div>
            <div class="measure--info--con">
              {{ thyroid_measure["3"] ? thyroid_measure["3"] : "/" }}
            </div>
          </div>
          <div class="measure--info--box">
            <div class="measure--info--title">左侧叶</div>
            <div class="measure--info--con">
              {{ thyroid_measure["4"] ? thyroid_measure["4"] : "/" }}
            </div>
            <div class="measure--info--con">
              {{ thyroid_measure["5"] ? thyroid_measure["5"] : "/" }}
            </div>
            <div class="measure--info--con">
              {{ thyroid_measure["6"] ? thyroid_measure["6"] : "/" }}
            </div>
          </div>
  
          <div class="measure--info--box">
            <div class="measure--info--title">最大结节</div>
            <div class="measure--info--con">
              {{ thyroid_measure["7"] ? thyroid_measure["7"] : "/" }}
            </div>
            <div class="measure--info--con">
              {{ thyroid_measure["8"] ? thyroid_measure["8"] : "/" }}
            </div>
            <div class="measure--info--con">
              {{ thyroid_measure["9"] ? thyroid_measure["9"] : "/" }}
            </div>
          </div>
        </div>
      </div>
      <!-- <div class="measure--info--wrap" v-if="type == '颈动脉'"> -->
      <div class="measure--info--wrap" v-if="type == '颈动脉'">
        <div class="measure--info--left">
          <div class="measure--info--sub">自动测量</div>
          <div class="measure--info--sub-item">IMT:(mm)</div>
          <div class="measure--info--sub-item">PS/ED:(cm/s)</div>
        </div>
        <div class="measure--info--right">
          <div class="measure--info--box">
            <div class="measure--info--title">左窦部</div>
            <div class="measure--info--con">
              {{
                artery_measure["16"] || artery_measure["20"]
                  ? artery_measure["16"] || artery_measure["20"]
                  : "/"
              }}
            </div>
            <div class="measure--info--con">/</div>
          </div>
          <div class="measure--info--box">
            <div class="measure--info--title">左 ICA</div>
            <div class="measure--info--con">
              {{
                artery_measure["21"] || artery_measure["22"]
                  ? artery_measure["21"] || artery_measure["22"]
                  : "/"
              }}
            </div>
            <div class="measure--info--con active">
              {{ psed_measure["1"] ? thyroid_measure["1"] : "/" }}
            </div>
          </div>
          <div class="measure--info--box">
            <div class="measure--info--title">左 CCA</div>
            <div class="measure--info--con">
              {{ artery_measure["19"] ? artery_measure["19"] : "/" }}
            </div>
            <div class="measure--info--con active">
              {{ psed_measure["2"] ? psed_measure["2"] : "/" }}
            </div>
          </div>
          <div class="measure--info--box">
            <div class="measure--info--title">右 窦部</div>
            <div class="measure--info--con">
              {{
                artery_measure["30"] || artery_measure["34"]
                  ? artery_measure["30"] || artery_measure["34"]
                  : "/"
              }}
            </div>
            <div class="measure--info--con">/</div>
          </div>
          <div class="measure--info--box">
            <div class="measure--info--title">右 ICA</div>
            <div class="measure--info--con">
              {{
                artery_measure["35"] || artery_measure["36"]
                  ? artery_measure["35"] || artery_measure["36"]
                  : "/"
              }}
            </div>
            <div class="measure--info--con active">
              {{ psed_measure["3"] ? psed_measure["3"] : "/" }}
            </div>
          </div>
          <div class="measure--info--box">
            <div class="measure--info--title">右 CCA</div>
            <div class="measure--info--con">
              {{ artery_measure["33"] ? artery_measure["33"] : "/" }}
            </div>
            <div class="measure--info--con active">
              {{ psed_measure["4"] ? psed_measure["4"] : "/" }}
            </div>
          </div>
        </div>
      </div>
    </div>
  </template>
  
  <script>
  export default {
    name: "measureComp",
    props: ["type", "data"],
    data() {
      return {};
    },
    computed: {
      artery_measure() {
        if (this.data) {
          const scanIMTInfo = JSON.parse(this.data).scanIMTInfo;
          const new_scanIMTInfo = {
            15: "",
            16: "",
            17: "",
            18: "",
            19: "",
            20: "",
            21: "",
            22: "",
            23: "",
            24: "",
            25: "",
            26: "",
            27: "",
            28: "",
            29: "",
            30: "",
            31: "",
            32: "",
            33: "",
            34: "",
            35: "",
            36: "",
            37: "",
            38: "",
            39: "",
            40: "",
            41: "",
            42: "",
          };
          for (var prop in scanIMTInfo) {
            new_scanIMTInfo[prop] = scanIMTInfo[prop];
          }
          console.log("颈动脉测量参数", new_scanIMTInfo);
          return scanIMTInfo;
        } else {
          return {
            15: "",
            16: "",
            17: "",
            18: "",
            19: "",
            20: "",
            21: "",
            22: "",
            23: "",
            24: "",
            25: "",
            26: "",
            27: "",
            28: "",
            29: "",
            30: "",
            31: "",
            32: "",
            33: "",
            34: "",
            35: "",
            36: "",
            37: "",
            38: "",
            39: "",
            40: "",
            41: "",
            42: "",
          };
        }
      },
      psed_measure() {
        if (this.data) {
          const psedInfo = JSON.parse(this.data).psedInfo;
          const new_psedInfo = {
            1: "",
            2: "",
            3: "",
            4: "",
          };
          for (var prop in psedInfo) {
            new_psedInfo[prop] = psedInfo[prop].replace('cm/s','').replace('cm/s','').replace(' ','');
          }
          console.log("颈动脉测量参数", new_psedInfo);
          return new_psedInfo;
        } else {
          return {
            1: "",
            2: "",
            3: "",
            4: "",
          };
        }
      },
      thyroid_measure() {
        if (this.data) {
          const thyroid_measure = JSON.parse(this.data).thyroid_measure;
          const new_thyroid_measure = {
            0: "",
            1: "",
            2: "",
            3: "",
            4: "",
            5: "",
            6: "",
            7: "",
            8: "",
            9: "",
          };
          for (var prop in thyroid_measure) {
            new_thyroid_measure[prop] = thyroid_measure[prop];
          }
          console.log("颈动脉测量参数", new_thyroid_measure);
          return new_thyroid_measure;
        } else {
          return {
            0: "",
            1: "",
            2: "",
            3: "",
            4: "",
            5: "",
            6: "",
            7: "",
            8: "",
            9: "",
          };
        }
      },
    },
  };
  </script>
  
  <style scoped lang="less">
  .measure--info {
    .measure--info--wrap {
      display: flex;
    }
    .measure--info--left {
      display: flex;
      flex-direction: column;
    }
    .measure--info--right {
      display: flex;
    }
    .measure--info--sub {
      width: 108px;
      height: 36px;
      line-height: 36px;
      text-align: left;
      color: rgba(255, 255, 255, 1);
      font-weight: bold;
      font-size: 18px;
    }
    .measure--info--sub-item {
      width: 104px;
      height: 36px;
      line-height: 36px;
      text-align: left;
      color: rgba(255, 255, 255, 0.45);
      font-size: 16px;
    }
    .measure--info--title {
      width: 108px;
      height: 36px;
      line-height: 36px;
      text-align: center;
      color: rgba(255, 255, 255, 0.45);
      font-weight: bold;
      font-size: 18px;
      border-bottom: 1px solid rgba(255, 255, 255, 0.45);
      border-right: 1px solid rgba(255, 255, 255, 0.45);
    }
    .measure--info--con {
      width: 108px;
      text-align: center;
      height: 36px;
      line-height: 36px;
      color: rgba(255, 255, 255, 1);
      font-size: 16px;
      border-bottom: 1px solid rgba(255, 255, 255, 0.45);
      border-right: 1px solid rgba(255, 255, 255, 0.45);
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      &.active {
        font-size: 12px;
      }
    }
  }
  </style>
  